var vm = new Vue({
    el: '#app',
    data: { //负责定义响应式数据

        list: [{
                pic: 'https://1.s91i.faiusr.com/4/AFsIyY_KAhAEGAAgx92UhAYoipCwczC4CDi4CA!500x500.png.webp?_tm=3&v=1629440245',
                name: '圣代',
                price: '0.02',
                count: '3'
            },
            {
                pic: 'https://1.s91i.faiusr.com/4/AFsIyY_KAhAEGAAgkN2UhAYopdze6wYwuAg4uAg!500x500.png.webp?_tm=3&v=1629440247',
                name: '葡萄啵啵',
                price: '0.23',
                count: '1'
            },
            {
                pic: 'https://1.s91i.faiusr.com/4/AFsIyY_KAhAEGAAg49yUhAYomLPWpwMwuAg4uAg!500x500.png.webp?_tm=3&v=1629440246',
                name: '抹茶',
                price: '0.21',
                count: '1'
            }
        ]
    },

    methods: {
        reduce(item) {
            if (item.count > 1) {
                return item.count--;
            }
        },
        add(item) {
            if (item.count < 5) {
                item.count++;
            }

        },
        empty1() {
            this.list = [];
        }
    },
    computed: {
        totalprice() {
            var sum = 0;
            this.list.forEach((item) => {
                sum += item.price * item.count;
            });
            return sum;

        },
        totalcount() {
            var sum = 0;
            this.list.forEach((item) => {
                sum += item.count / 1;
            })
            return sum;
        }
    }

})